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css cheat sheet 


font-style: normal | italic | oblique 

font-weight: normal | bold | bolder | lighter | 100 - 900 
font-size: 12px | 0.8em 

text-transform: capitalise | lowercase | uppercase 
letter-spacing: normal | 4px 

line-height: normal | 3em | 34% 

text-align: left | right | center | justify 

text-decoration: none | underline | overline | line-through 


font-family: 'Open Sans’, sans-serif 


position: relative | absolute | fixed | sticky 
float: left | right | none 

z-index: 0-999 

eg. z-index: 99; 


position: relative 


background-image: url() 

background-repeat: repeat-x | repeat-y | repeat | no-repeat 
background-attachment: scroll | fixed | initial | inherit 
background-color: #2AA9E0O 

background-position: top | right | bottom | left | center 


border-color: #2AA9E0O 

border-style: none | hidden | dotted | dashed | solid | double | groove 
ridge | inset | outset 

border-width: 10px 

eg. border: solid 2px #000; 
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MARGIN & PADDING 


margin-top: 2px padding-top: 2px 
margin-right: 4px padding-right: 4px 
margin-bottom: 6px padding-bottom: 6px 
margin-left: 8px padding-left: 8px 


margin: 2px 4px 6px 8px 


padding: 2px 4px 6px 8px 


MARGIN 


BORDER 


PADDING 


CONTENT 
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USEFUL SNIPPETS 


STYLE THE READ MORE LINK 


.more-link { 
width: 122px; 
display: block; 
color: #000; 
border: solid 1px; 
letter-spacing: 2px; 
text-transform: uppercase; 
margin-top: 15px; 
padding: 3px 0 3px 10px; 
font-family: Montserrat; 
font-size: 13px; 

} 

a.more-link:hover 
color: #666; 

} 


STYLE THE WORDPRESS COMMENTS AREA 


#comments .page title { 
font-size: 24px !important; 

} 

.comment-reply-title { 
font-family: Playfair Display; 
font-size: 24px; 
font-style: italic; 

} 

#commentform textarea { 
color: #000; 
background-color: #f5f5f5; 
font-size: 15px; 

} 

#comments { 
font-family: Montserrat; 
text-transform: uppercase; 
font-size: 14px; 


} 
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